<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <title th:text="${question.title}"></title>
    <div th:replace="commonPage::comLink"></div>
</head>
<body>
<div th:replace="commonPage::#loader"></div>

<div th:replace="commonPage::comIndexHeaderMune"></div>


<!--      问题详情     -->
<div class="container-fluid1 padding-bottom-120px padding-top-140px mx-auto">
    <div class="row">
        <div class="col-lg-7 col-md-12 col-sm-12 col-xs-12 mx-auto ">
            <h2><span class="glyphicon glyphicon-search " aria-hidden="true"> [[${question.title}]]</span></h2>
            <br>
            <span class="text-about">
                作者：
                <span th:text="${question.user.name}"></span> ,&emsp;
                浏览量：
                <span th:text="${question.viewCount}"></span> ,&emsp;
                发布时间：
                <span th:text="${#dates.format(question.gmtCreate,'yyyy-MM-dd HH:mm')}"></span> ,
                最后修改时间：
                <span th:text="${#dates.format(question.gmtModify,'yyyy-MM-dd HH:mm')}"></span>
            </span>
            <hr>
            <!--            文章内容-->
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 mx-auto">
                <div id="question_des" class="text-desc">
                    [[${question.description}]]
                </div>
            </div>


            <!--             评论内容      -->
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 mx-auto">
                <div th:each="comment : ${comments}">
                    <hr>
                    <div th:id="${comment.id}" tabindex = "0">
                        <div class="media">
                            <div class="media-left media-margin">
                                <a href="#">
                                    <img class="media-object " th:src="${comment.user.imgUrl}"></img>

                                    <span class="media-font">[[${comment.user.name}]]</span>
                                </a>
                            </div>
                            <div class="media-body media-margin">
                                <span th:text="${comment.content}" class="comment-whitespace"></span>

                                <!--                            评论回复区                                     -->
                                <div th:if="${comment.replyCount}>0">
                                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 collapse reply-area in">
                                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 reply-content">
                                            <div th:each="reply : ${comment.replies}">
                                                <hr>
                                                <div class="media">
                                                    <div class="media-left media-margin" th:id="${reply.id}">
                                                        <img class="reply-img" th:src="${reply.user.imgUrl}">
                                                        <br>
                                                        <span class="media-font">[[${reply.user.name}]]</span>
                                                    </div>
                                                    <div class="media-body media-margin">
                                                    <span class="btn-right" th:text="${#dates.format(reply.getGmtCreate(),
                                                    'yyyy-MM-dd HH:mm')}"></span>
                                                        <span th:text="${reply.content}" class="comment-whitespace"></span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--             评论回复     -->
                                <!--                            th:href="'/reply/' + ${comment.id}"-->
                                <form th:id="${comment.id}+'Form'" th:name="${comment.id}+'Form'" class="reply-hidden"
                                      th:action="@{'/reply/' + ${comment.id} + '/'+ ${comment.parentId}}" method="post"
                                      th:onsubmit="return checkReply([[${comment.id}]]);">
                                    <br>
                                    <div class="form-group">
                                        <label>请输入您的回复：</label>
                                        <textarea class="form-control" th:id="${comment.id}+'Area'"
                                                  th:name="${comment.id}+'Area'"
                                                  rows="8" cols="3" placeholder="请输入回复"></textarea>
                                    </div>
                                    <button class="btn btn-primary btn-right ">提交回复</button>
                                </form>
                            </div>


                            <!--                        评论操作            -->
                            <span th:text="${#dates.format(comment.getGmtCreate(),'yyyy-MM-dd HH:mm')}"></span>
                            <div name="userManage" class="btn-right">
                                <br><br>
                                <!--                               回复评论                       -->
                                <span  style="cursor: pointer;"
                                        th:id="${comment.id}+'Btn'"
                                        th:name="${comment.id}+'Btn'"
                                        th:onclick="reply([[${comment.id}]]);">
                                    <i class="fa fa-comments fa-2x"></i>
                                </span>
                                <!--                                   删除评论              -->
                                <div th:if="${session.loginUser==comment.user}">
                                    <a th:href="@{'/delete/comment/'+${comment.id}+'/'+${comment.parentId}}"
                                       onclick="return confirmDeleteComment()">
                                        <i class="fa fa-trash-o fa-lg icon-delete fa-2x">
                                        </i></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--            分界线    评论         -->
                <hr class="col-lg-12 col-md-12 col-sm-12 col-xs-12 mx-auto">
                <a th:if="${session.loginUser==question.user}" th:href="@{'/publish/'+${question.id}}">
                    <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>编辑</a>

                <form name="commentForm" method="post" th:action="@{'/comment/'+${question.id}}"
                      onsubmit="return checkComment()">
                    <div class="form-group">
                        <label>说出您的想法吧：</label>
                        <textarea name="comment" id="comment" class="form-control" placeholder="用你的知识去帮他人解疑吧！" cols="20"
                                  rows="10"></textarea>
                    </div>
                    <button class="btn btn-primary btn-right">提交</button>
                </form>
            </div>
        </div>
        <div class="col-lg-4 col-md-12 col-sm-12 col-xs-12 ">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 ">
                <h3>问题发布者</h3>
                <hr>
                <div class="media">
                    <div class="media-left">
<!--                        <a href="#">-->
                            <img class="img-publish img-circle" th:src="${question.user.getImgUrl()}"> &emsp;

                        <!--                        </a>-->
                    </div>
                    <div class="media-body">
                        <h4 class="text-title">
                            [[${question.user.name}]]
                        </h4>
                        <a th:href="@{'/userCenter/communicate/'+${question.user.name}}"
                           class="fa fa-envelope  btn-communicate"> 私信 </a>
                        <br>
                        <span th:text="${#dates.format(question.gmtCreate,'yyyy-MM-dd HH:mm')}"></span>
                        <br>
                        <div class="section-divider"></div>

                    </div>
                </div>
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 ">
                    <hr>
                    <h3>TA的热门问题</h3>
                    <div th:each=" question : ${hisQuestions}">
                        <br>
                        <a th:href="@{'/question/'+${question.id}}">
                        <span class="his-questions">
                            <b> [[${question.title}]]</b>
                        </span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
<div th:replace="commonPage::comFooter">
</div>
<div th:replace="commonPage::comScript">
</div>
    <script>
        var des  =$("#question_des").text();
        $("#question_des").html(des);
    </script>
</div>
</body>
</html>